<template>
  <a-modal
    title="新技术应用情况上报"
    :visible="visible"
    class="normal-modal"
    @cancel="handleCancel"
  >
    <div class="about-master-container">
      <a-form>
        <a-form-model
          ref="form"
          :model="localForm"
          :rules="rules"
        >
          <a-row>
            <a-col span="24">
              <a-form-model-item
                label="应用技术："
                prop="technicalId"
              >
                <b-input
                  v-model="localForm.technicalName"
                  disabled
                />
              </a-form-model-item>
            </a-col>
            <a-col span="24">
              <a-form-model-item
                label="所属单位："
                prop="branchCompanyId"
              >
                <b-input
                  v-model="localForm.viewName"
                  disabled
                />
              </a-form-model-item>
            </a-col>
<!--            <a-col span="12">-->
<!--              <a-form-model-item-->
<!--                label="项目名称："-->
<!--                prop="projectId"-->
<!--              >-->
<!--                <b-input-->
<!--                  v-model="localForm.projectName"-->
<!--                  disabled-->
<!--                />-->
<!--              </a-form-model-item>-->
<!--            </a-col>-->
            <a-col span="12">
              <a-form-model-item
                label="最新应用工程量："
                prop="applicationNumber"
              >
                <BaseInputNumber
                  v-model.trim="localForm.applicationNumber"
                  :min="0"
                  placeholder="请输入"
                />
              </a-form-model-item>
            </a-col>
            <a-col span="12">
              <a-form-model-item
                :label="`最新实物量（${localForm.applyUnit}）`"
                prop="entityMeasure"
              >
                <BaseInputNumber
                  v-model.trim="localForm.entityMeasure"
                  :max-length="9"
                  placeholder="请输入"
                />
              </a-form-model-item>
            </a-col>
            <a-col span="12">
              <a-form-model-item
                label="最新投入经费（万元）："
                prop="investmentOutlay"
              >
                <BaseInputNumber
                  v-model.trim="localForm.investmentOutlay"
                  :max="10000000000"
                  :min="0"
                  :precision="6"
                  placeholder="请输入"
                />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col span="12">
              <a-form-model-item
                label="最新生产效益（万元）："
                prop="productionBenefit"
              >
                <BaseInputNumber
                  v-model.trim="localForm.productionBenefit"
                  :max="10000000000"
                  :min="0"
                  :precision="6"
                  placeholder="请输入"
                />
              </a-form-model-item>
            </a-col>
            <a-col span="24">
              <a-form-model-item label="附件上传" prop="fileArrays">
                  <upload-list
                      class="limitText"
                      v-if="visible && state !== 2"
                      business-code="STM01"
                      :upload-arrys.sync="localForm.fileArrays"
                      :count="5"
                      multiple
                      @fileArrysData="$refs.form.validateField('fileArrays')"
                  />
                  <file-link v-else :file-list="localForm.fileArrays" />
              </a-form-model-item>
              <span v-if="state !== 2" class="del_btn" style="margin-left: 95px"
                  >提示：上传附件为应用新技术对应照片，每张照片以 小项编号 技术名称 地区+项目名称</span>
          </a-col>
          </a-row>
        </a-form-model>
      </a-form>
    </div>
    <template slot="footer">
      <template>
        <a-button
          :loading="confirmLoading"
          type="primary"
          @click.stop="handleOk()"
        >
          提交
        </a-button>
      </template>
      <a-button
        type="default"
        @click.stop="handleCancel"
      >
        取消
      </a-button>
    </template>
  </a-modal>
</template>

<script>
import { renew } from '@/api/technology'
import UploadList from '@/components/UploadList'
export default {
  name: 'a' + Date.now(),
  components: {},
  props: {
    visible: {
      type: Boolean,
      required: true
    },
    form: {
      type: Object,
      default() {
        return null
      }
    }
  },
  components:{
    UploadList
  },
  data() {
    return {
      confirmLoading: false,
      localForm: { technicalId: '' , viewName: ''},
      rules: {
        applicationNumber: [{ required: true, message: '请输入最新应用工程量', trigger: 'blur' }],
        entityMeasure: [{ required: true, message: '请输入最新实物量（套）', trigger: 'blur' }],
        investmentOutlay: [{ required: true, message: '请输入最新投入经费（万元）', trigger: 'blur' }],
        productionBenefit: [{ required: true, message: '请输入最新生产效益（万元）', trigger: 'blur' }],
        fileArrays: [{ type: 'array', required: true, message: '请上传附件', trigger: 'blur' }]
      }

    }
  },
  watch: {
    visible(newVal) {
      if (this.form) {
        this.localForm = this.$assign(this.localForm, this.form)
        this.localForm.viewName = this.localForm.branchCompany + "/" + this.localForm.projectName
      } else {
        this.localForm = { technicalId: '',applyUnit: '套' }
      }
    }
  },
  methods: {
    handleOk(type) {
      this.$refs.form.validate(async (valid) => {
        if (valid) {
          this.confirmLoading = true
          let res = await renew(this.localForm)
          this.confirmLoading = false
          if (res.code === this.SUCCESS_CODE) {
            this.$emit('ok')
            this.handleCancel()
            this.$noticeSuccess('更新成功')
          }
        } else {
          this.$noticeWarning('请填写完整')
        }
      })
    },
    handleCancel() {
      this.$emit('update:visible', false)
      this.$refs.form.resetFields()
      this.localForm = { technicalId: '' }
    }
  }
}
</script>
